/**
 * @description  : 一键搜详情
 * @descriptionDetail : 一键搜详情
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-11-03 17:36:50
 */
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="false" backText="返回" :title="navTitle"></theme-navbar>
    <!-- #endif -->
    <view class="">
      <view class="key-search-lay">
        <u-search
          class="key-search"
          shape="round"
          :clearabled="true"
          :showAction="true"
          actionText="确定"
          placeholder="请输入要查询的信息"
          v-model="searchKey"
          @custom="toSearchList"
        ></u-search>
        <view class="u-m-b-16 u-m-l-5">
          <choice-tag :allowEmptyChoice="false" :customStyle="customStyle" :btnList="dataTypes" :single="false" :tapListener="tapListener"></choice-tag>
        </view>
        <view class="main-total">
          为您找到相关结果约<text class="total-desc">
            {{ totalCount }}
          </text>条
        </view>
      </view>
      <!-- 列表内容 -->
      <view class="tabsBottom content u-m-t-20">
        <me-table
          :i="0"
          :top="300"
          :index="0"
          :load-data="getAnalysisInfoData"
          :init-load="false" 
          ref="mescrollItem0"
        > 
          <template slot-scope="d">
            <view class="main-content" @click="detailClick(d.data)">
              <view class="main-icon">
                <u-image width="46rpx" height="46rpx" mode="widthFix" :src="iconImage[d.data.index]"></u-image>
              </view>
              <view class="main-title u-p-b-30">
                <text class="title-top">
                  {{ d.data.typeName }}  {{ d.data.title || '空记录' }}
                </text>
                <text class="title-sub" v-html="d.data.content">
                  {{ d.data.content }}
                </text>
                <text class="title-sub">
                  {{ d.data.footer[0] }}  {{ d.data.footer[1] }}
                </text>
              </view>
            </view>
          </template>
        </me-table>
      </view>
    </view>
  </view>
</template>

<script> 
import meTable from '@/components/me-table.vue'
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import choiceTag from '@/components/choice_tag.vue';
import {INFORMATION_ANALYSIS_DATA,SEARCH_HISTORY_TYPE,} from "@/service/infoAnalysis/mapping/enum.js";
import analysisService from "@/service/infoAnalysis/info.analysis.service.js";
import searchHistoryService from "@/service/utilities/searchHistory.service.js";
export default {
  components: { 
    choiceTag,
    meTable,
  },
  mixins: [MescrollMoreMixin,],
  data() {
    return {
      SEARCH_HISTORY_TYPE,
      customStyle: {
        "margin-left": "5px",
        "margin-right": "5px",
        "padding-left": "20px",
        "padding-right": "20px",
        "margin-bottom": "10px",
        "background-color": "#f5f5f5",
        "border": "none",
        "border-radius": "4px",
      },
      iconImage:{
        'zmpt_lic':'/static/retailer_info.png',
        'zmpt_case':'/static/case/icon-item.png', 
        'zmpt_transport':'/static/check/cars.png',
        'zmpt_person':'/static/check/icon_cooperate.png',
        'zmpt_transport_train' : '/static/check/cars.png',
        'zmpt_transport_car' : '/static/check/cars.png',
        'zmpt_transport_plane' : '/static/check/cars.png',
        'zmpt_transport_ship' : '/static/check/cars.png',
      },
      totalCount:0,
      dataTypes: INFORMATION_ANALYSIS_DATA, // 
      searchKey:'',
      anaylisysList:[],
      userInfo:this.$storage.get(this.$rp.common.USER).user,
      preParams:{},
    };
  }, 
  onLoad(){
    this.preParams =  this.getRouteParam() || {};
  },
  mounted() {
    this.searchKey = this.preParams.searchKey;
  },
  methods: {
    // 获取情报数据
    getAnalysisInfoData(page){
      let type = "";
      if(this.preParams.type && this.preParams.type.indexOf(INFORMATION_ANALYSIS_DATA[3].code) != -1){
        type = this.preParams.type.replace(INFORMATION_ANALYSIS_DATA[3].code, INFORMATION_ANALYSIS_DATA[3].realCodes.join(','));
      }else{
        type = this.preParams.type || "";
      }
      let params = {
        index : page.num - 1,
        size : page.size,
        tags : type,
        name : this.preParams.searchKey,
        menuCode:"",
      };
      return new Promise(resolve => {
        analysisService.searchInfo(params).then((res) => {
          if(res.success){
            this.totalCount = res.count;
            let list = res.data ? res.data : [];
            if(list.length > 0){
              list.forEach(item => {
                let keys = this.preParams.searchKey.trim();
                if(item.content){
                  item.content = item.content.replaceAll(keys, `<span style='color: red'>${keys}</span>`);
                }else{
                  item.content = "";
                }
                if(!item.footer){
                  item.footer = ["","",];
                }
              });
            }
            resolve({data: list,count:res.count,});
          }else{
            resolve({"data": [],});
            this.$u.toast(res.msg);    
          }
        }).catch((error) => {
          console.log(error);
          resolve({"data": [],});
          this.$u.toast(error);
        });
      });
    },
    toSearchList(){
      this.preParams.searchKey = this.searchKey;
      this.$refs["mescrollItem0"].refresh(); 
      this.saveHistory(this.searchKey);
    },
    // 历史数据保存本地
    saveHistory(searchKey){
      if(this.$u.test.isEmpty(this.searchKey)){
        return;
      }
      let params = {
        title : searchKey,
        context : searchKey,
        type : this.SEARCH_HISTORY_TYPE.TAG_INFOMATION_ANALYSIS,
        userId : this.userInfo.personUuid,
        uuid : this.$u.guid(20),
      }
      searchHistoryService.saveIndexDBKeySearch(params).then(res => {
        // this.$u.toast(res);
      });
    },
    detailClick(obj){
      this.setRouteParam(obj);
      this.$u.route("pages/keySearch/searchDetail");
    },
    // 监听多选操作
    tapListener(arr){
      let dataCode = [];
      if (arr.length > 0) {
        arr.forEach(item => {
          dataCode.push(item.code);
        });
      }
      this.preParams.type = dataCode.join(",");
      this.toSearchList();
    },
  },
};
</script>

<style lang="scss" scoped>
.page{ padding:0; }
.key-search-lay{
  background-color: #fff;
	position: fixed;
  /* #ifdef H5-DINGDING || H5-WECHAT  */
    top: 0px;
    /* #endif */
    /* #ifdef H5-ONLY  */
    top: 44px;
    /* #endif */
	z-index: 999;
	width: 100%;
  .key-search{
    padding: $cm-search-padding-row $cm-search-padding-column;
  }
}
.content{
  width:95%;
  margin:auto;
}

.main-total{
  background: #f5f5f5;
  line-height: 32px;
  padding-left:32rpx;
  color: #666;
  .total-desc{
  }
}
.main-content{
  display: flex;
  min-height: 88px;
  padding-bottom: 20px;
  .main-title{
    display: flex;
    flex-direction: column;
    padding-left: 10px;
	border-bottom: 1px solid #DFE0E1;
    .title-top{
      font-size: 15px;
      font-weight: bold;
      color: #333333;
    }
    .title-sub{
      font-size: 13px;
      color: #666;
      line-height: 20px;
      padding-top: 5px;
    }
  }
}
</style>
